@extends('generalAdmin.general-admin-layouts')
@section('style')
    <meta name="_token" content="{{ csrf_token() }}"/>
    <style>
        .index-title{
            text-align: center;
            color: #676767
        }
        .btn-primary{
            background: #009aff;
            float: left;
        }
        .ico{
            width: 45px;
            height: 45px;
        }
    </style>
    <link rel="stylesheet" href="{{asset('admin_assets/css/bootstrap-datetimepicker.min.css')}}">
    <link rel="stylesheet" href="{{asset('admin_assets/css/pretty.min.css')}}">
    <link async rel="stylesheet" href="https://cdn.materialdesignicons.com/1.8.36/css/materialdesignicons.min.css"/>
@stop
@section('content')
    <div class="content-wrapper" style="background-color: white">
        <section class="content">
            <div class="row">
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <div class="info-box">
            <span class="info-box-icon bg-aqua">
                <img src="{{asset('admin_assets/img/trademark_little_icon.png')}}" class="ico">
            </span>
                        <div class="info-box-content">
                            <h3 class="index-title">商标</h3>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <div class="info-box">
            <span class="info-box-icon bg-aqua">
                <img src="{{asset('admin_assets/img/total-ico.png')}}" class="ico">
            </span>
                        <div class="info-box-content">
                            <h3 class="index-title">总数：{{$count['count'][1]}}</h3>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <div class="info-box">
            <span class="info-box-icon bg-aqua">
                <img src="{{asset('admin_assets/img/finish-ico.png')}}" class="ico">
            </span>
                        <div class="info-box-content">
                            <h3 class="index-title">完成数：{{$count['num'][1]}}</h3>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <div class="info-box">
            <span class="info-box-icon bg-aqua">
                <img src="{{asset('admin_assets/img/dealing-ico.png')}}" class="ico">
            </span>
                        <div class="info-box-content">
                            <h3 class="index-title">处理数:{{$count['count'][1]-$count['num'][1]}}</h3>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <div class="info-box">
            <span class="info-box-icon bg-red">
                <img src="{{asset('admin_assets/img/patent_little_icon.png')}}" class="ico">
            </span>
                        <div class="info-box-content">
                            <h3 class="index-title">专利</h3>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <div class="info-box">
            <span class="info-box-icon bg-red">
               <img src="{{asset('admin_assets/img/total-ico.png')}}" class="ico">
            </span>
                        <div class="info-box-content">
                            <h3 class="index-title">总数：{{$count['count'][0]}}</h3>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <div class="info-box">
            <span class="info-box-icon bg-red">
               <img src="{{asset('admin_assets/img/finish-ico.png')}}" class="ico">
            </span>
                        <div class="info-box-content">
                            <h3 class="index-title">完成数：{{$count['num'][0]}}</h3>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <div class="info-box">
            <span class="info-box-icon bg-red">
                <img src="{{asset('admin_assets/img/dealing-ico.png')}}" class="ico">
            </span>
                        <div class="info-box-content">
                            <h3 class="index-title">处理数:{{$count['count'][0]-$count['num'][0]}}</h3>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <div class="info-box">
            <span class="info-box-icon bg-green">
                <img src="{{asset('admin_assets/img/copyright_little_icon.png')}}" class="ico">
            </span>
                        <div class="info-box-content">
                            <h3 class="index-title">版权</h3>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <div class="info-box">
            <span class="info-box-icon bg-green">
                <img src="{{asset('admin_assets/img/total-ico.png')}}" class="ico">
            </span>
                        <div class="info-box-content">
                            <h3 class="index-title">总数：{{$count['count'][2]}}</h3>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <div class="info-box">
            <span class="info-box-icon bg-green">
                <img src="{{asset('admin_assets/img/finish-ico.png')}}" class="ico">
            </span>
                        <div class="info-box-content">
                            <h3 class="index-title">完成数：{{$count['num'][2]}}</h3>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <div class="info-box">
            <span class="info-box-icon bg-green">
                <img src="{{asset('admin_assets/img/dealing-ico.png')}}" class="ico">
            </span>
                        <div class="info-box-content">
                            <h3 class="index-title">处理数:{{$count['count'][2]-$count['num'][2]}}</h3>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <div class="info-box">
            <span class="info-box-icon bg-yellow">
                <img src="{{asset('admin_assets/img/project_little_cion.png')}}" class="ico">
            </span>
                        <div class="info-box-content">
                            <h3 class="index-title">项目</h3>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <div class="info-box">
            <span class="info-box-icon bg-yellow">
                <img src="{{asset('admin_assets/img/total-ico.png')}}" class="ico">
            </span>
                        <div class="info-box-content">
                            <h3 class="index-title">总数：{{$count['count'][3]}}</h3>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <div class="info-box">
            <span class="info-box-icon bg-yellow">
               <img src="{{asset('admin_assets/img/finish-ico.png')}}" class="ico">
            </span>
                        <div class="info-box-content">
                            <h3 class="index-title">完成数：{{$count['num'][3]}}</h3>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <div class="info-box">
            <span class="info-box-icon bg-yellow">
                <img src="{{asset('admin_assets/img/dealing-ico.png')}}" class="ico">
            </span>
                        <div class="info-box-content">
                            <h3 class="index-title">处理数:{{$count['count'][3]-$count['num'][3]}}</h3>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <div class="info-box">
            <span class="info-box-icon bg-red">
               <img src="{{asset('admin_assets/img/total-ico.png')}}" class="ico">
            </span>
                        <div class="info-box-content">
                            <h3 class="index-title">未结算</h3>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <div class="info-box">
            <span class="info-box-icon bg-red">
               <img src="{{asset('admin_assets/img/total-ico.png')}}" class="ico">
            </span>
                        <div class="info-box-content">
                            <h3 class="index-title">总数：{{$result}}</h3>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <div class="info-box">
            <span class="info-box-icon bg-red">
               <img src="{{asset('admin_assets/img/total-ico.png')}}" class="ico">
            </span>
                        <div class="info-box-content">
                            <h3 class="index-title">未结单</h3>
                        </div>
                    </div>
                </div>
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                    <div class="info-box">
            <span class="info-box-icon bg-red">
               <img src="{{asset('admin_assets/img/total-ico.png')}}" class="ico">
            </span>
                        <div class="info-box-content">
                            <h3 class="index-title">总数：{{$sql}}</h3>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#selectMonthModal">选择年份/月份</button>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="table-responsive">
                        <div id="year_sale_line" style="width: 100%;height:500px"></div>
                        <span id="year_line" style="display: none">{{$data['yearSell']}}</span>
                        <span id="year" style="display: none">{{$data['year']}}</span>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="table-responsive">
                        <div id="month_sale_line" style="width: 100%;height:500px"></div>
                        <span id="month_line" style="display: none">{{$data['monthSell']}}</span>
                        <span id="month" style="display: none">{{$data['month']}}</span>
                    </div>
                </div>
            </div>
        </section>
    </div>
    @include('public/selectMonthModal')
@stop
@section('javascript')
    <script src="{{asset('admin_assets/js/echarts.min.js')}}"></script>
    <script>
        var yearChart = echarts.init(document.getElementById('year_sale_line'));
        var monthChart = echarts.init(document.getElementById('month_sale_line'));
        var year_line=window.document.getElementById("year_line").innerText.split(";");
        var month_line=window.document.getElementById("month_line").innerText.split(";");
        var year=window.document.getElementById("year").innerText;
        var month=window.document.getElementById("month").innerText;
        var year_date=[],year_times=[],month_date=[],month_times=[];
        if(year_line!=''){
            for(var i=0;i<year_line.length;i++){
                year_date.push(year_line[i]);
                year_times.push((i+1) + "月");
            }
        }
        if(month_line!=''){
            for(var i=0;i<month_line.length;i++){
                month_date.push(month_line[i]);
                month_times.push((i+1) + "日");
            }
        }
        yaeroption = {
            title: {
                text: year+'年销售趋向:'
            },
            tooltip: {
                trigger: 'axis'
            },
            legend: {
                data:[year+'年销售额']
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            xAxis: {
                type: 'category',
                boundaryGap: false,
                data:year_times
            },
            yAxis: {
                type: 'value',
                min:'0'
            },
            series: [
                {
                    name:year+'年销售额',
                    type:'line',
                    lineStyle:{
                        normal:{
                            width:2,
                            color: "red"
                        }
                    },
                    stack: year+'年销售额',
                    data:year_date
                }
            ]
        };
        monthoption = {
            title: {
                text: month+'月销售趋向:'
            },
            tooltip: {
                trigger: 'axis'
            },
            legend: {
                data:[month+'月销售额']
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            xAxis: {
                type: 'category',
                boundaryGap: false,
                data:month_times
            },
            yAxis: {
                type: 'value',
                min:'0'
            },
            series: [
                {
                    name:month+'月销售额',
                    type:'line',
                    lineStyle:{
                        normal:{
                            width:2,
                            color: "red"
                        }
                    },
                    stack: month+'月销售额',
                    data:month_date
                }
            ]
        };
        yearChart.setOption(yaeroption);
        monthChart.setOption(monthoption);
    </script>
@stop
